<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8"/>
	<meta name="baidu-site-verification" content="JdMif0g2tL" />
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>angular</title>
</head>
<body ng-app="myApp">

<div ng-controller="appCtrl">
	<input ng-model="msg">
	<p>{{msg}}</p>
	<p msg-data="msg" show-msg="123"></p>
</div>

<script type="text/javascript">
	document.getElementsByTagName('html')[0].style.fontSize=window.screen.width/10+'px';
</script>
<script src="../js/angular.min.js" charset="utf-8"></script>
<script type="text/javascript">
	var app =angular.module('myApp', []);
	app.controller('appCtrl', ['$scope', function($scope){
		// $scope.msg='hellow'
	}])
	app.directive('showMsg',function(){
		return{
			restrict:'A',
			template:'<h2>{{msg}}|{{icak}}</h2>',
			scope:{
				msg:'=msgData'//属性值与作用域变量绑定起来
			},
			controller:function($scope,$element,$attrs){
				$scope.msg='小兵';
				$scope.icak='icak';
				console.log($scope)
			}
		}
	})
</script>
</body>
</html>